import React from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import './index.less';
import CommonHeader from 'COMPONENT/CommonHeader';
import FootTabBar from 'COMPONENT/FootTabBar';
import HeaderBar from 'COMPONENT/HeaderBar';
import {Icon} from 'antd-mobile'
import {Link} from 'react-router'

export default class LifeService extends React.Component {
    static contextTypes = {
    router: PropTypes.object.isRequired
  }
  constructor(props) {
    super(props);

  }

  componentWillMount() {
    //获取token
  }

  goPay=()=>{
    this.context.router.push({
        pathname: '/LifeService/Pay',
    })
  }

  render() {
    return (
      <div>
       
        <div className='lifeService' style={{padding:'0'}}>
            <img src="./imgs/banner3.png" alt=""/>
            <p><span>充值</span>100元生活优惠劵,帮你开启品质生活<Icon type='right'/></p>
            <ul>

                <li onClick={this.goPay.bind(this)}>
                    <h2>缴 费</h2>
                    <p>代缴水电煤气等费用</p>
                    <img src="./imgs/jf.jpg" alt=""/>
                </li>
                <li>
                    <h2>家 政</h2>
                    <p>拥抱清新 回归自如</p>
                    <img src="./imgs/js.png" alt=""/>
                </li>
                <li>
                    <h2>维 修</h2>
                    <p>及时专业 安全守护</p>
                    <img src="./imgs/wx.png" alt=""/>
                </li>
                <li>
                    <h2>健 身</h2>
                    <p>运动不止 生生不息</p>
                    <img src="./imgs/js.png" alt=""/>
                </li>
            </ul>
            {/*<img src="./imgs/pp.png" style={{marginTop:'.2rem'}}/>*/}
            <div className='lifeServiceBox'>
                <h2>热门推荐</h2>
                <ul>
                    <li>
                        <p>日常保洁</p>
                        <span>高温蒸汽杀菌</span>
                        <img src="./imgs/dd2.png" alt=""/>
                    </li>
                    <li>
                        <p>xx保洁卡</p>
                        <span>买1000赠100</span>
                        <img src="./imgs/dd3.png" alt=""/>
                    </li>
                    <li>
                        <p>除螨保洁</p>
                        <span>标杆级除螨设备</span>
                        <img src="./imgs/dd1.png" alt=""/>
                    </li>
                    <li>
                        <p>双人沙发</p>
                        <span>高颜值家具</span>
                        <img src="./imgs/dd4.png" alt=""/>
                    </li>
                </ul>
            </div>
            <div className='lifeServiceBox'>
                <h2>欢迎加入<span>与百万客户共享品质生活</span></h2>
                <div className='joinUs'>
                    <div>
                        <img src="./imgs/sp.png" alt=""/>
                        <p>使用用户</p>
                        <a>147</a>
                        <p>昨日+18</p>
                    </div>
                     <div>
                        <img src="./imgs/fw.png" alt=""/>
                        <p>服务用户</p>
                        <a>1267</a>
                        <p>昨日+32</p>
                    </div>
                     <div>
                        <img src="./imgs/dd.png" alt=""/>
                        <p>累计订单</p>
                        <a>12345667</a>
                        <p>昨日+868</p>
                    </div>
                </div>


            </div>



        </div>

        <FootTabBar selectedTab='redTab' />
		
      </div>
    );
  }
}